<div class="rightDiv">
  <div class="exciseTableDiv">
    <div class="searchDiv fl-r" style="margin-bottom: 15px">
      <label>
        <span>标签：</span>
        <input nz-input placeholder="请输入标签" [(ngModel)]="searchLabel"/>
      </label>
      <label>
        <span>描述：</span>
        <input nz-input placeholder="请输入描述" [(ngModel)]="searchDesc"/>
      </label>
      <label style="margin-right: 0">
        <button nz-button style="margin-right:10px" nzType="primary" (click)="clickSearch()">查询</button>
        <button nz-button nzType="default" (click)="resetSearch()">重置</button>
      </label>
    </div>
    <div class="tableTop fl-l" style="margin-bottom: 15px">
      <button nz-button nzType="primary" (click)="clickAdd()"><i nz-icon nzType="plus" nzTheme="outline"></i>新增
      </button>
      <button nz-button nzType="default"
              nz-popconfirm
              nzOkType="danger"
              nzTitle="确定删除所选字典吗?"
              (nzOnCancel)="cancelFn()"
              (nzOnConfirm)="deleteAll()"
              [disabled]="canDelete"
              nzPlacement="top"
      >
        <i nz-icon nzType="delete" nzTheme="outline"></i>删除
      </button>
    </div>
    <div style="margin-top: 35px">
      <ng-template #totalTemplate let-total>总共 {{ pageInfo.totalRecords? pageInfo.totalRecords:0 }} 条</ng-template>
      <nz-table
        #exciseBankTable
        nzBordered
        [nzData]="allList"
        [nzFrontPagination]="false"
        [nzShowPagination]="true"
        [nzPageIndex]="pageInfo.first"
        [nzTotal]="pageInfo.totalRecords"
        [nzShowTotal]="totalTemplate"
        [nzPageSize]="pageInfo.rows"
        [nzLoadingDelay]="1"
        [nzPageSizeOptions]="[10,20,30,50,100]"
        [nzShowQuickJumper]="true"
        [nzShowSizeChanger]="true"
        (nzPageIndexChange)="searchPageIndex($event)"
        (nzPageSizeChange)="searchPageSize($event)"
        (nzCurrentPageDataChange)="currentPageDataChange($event)"
      >
        <thead>
        <tr>
          <th class="tableCheck"
              nzShowCheckbox
              [(nzChecked)]="isAllCheck"
              [nzIndeterminate]="isIndeterminate"
              (nzCheckedChange)="checkAll($event)"
          ></th>
          <th>键码</th>
          <th>键值</th>
          <th>标签</th>
          <th>描述</th>
          <th>排序<br><span style="color:#888;font-size:12px;">值越小,排序越高</span></th>
          <th style="width:155px;">操作</th>
        </tr>
        </thead>
        <tbody>
        <tr *ngFor="let data of exciseBankTable.data">
          <td
            nzShowCheckbox
            [(nzChecked)]="mapOfCheckedId[data.id]"
            (nzCheckedChange)="refreshStatus()"
          ></td>
          <td>{{ data.keyCode ? data.keyCode : '' }}</td>
          <td>{{ data.keyValue ? data.keyValue : ''}}</td>
          <td>{{ data.type ? data.type : ''}}</td>
          <td>{{ data.description ? data.description : ''}}</td>
          <td>{{ data.orderLevel ? data.orderLevel : ''}}</td>
          <td>
            <span class="operaFont firOpera" (click)="editUser(data)">编辑</span>
            <span class="operaFont firOpera" (click)="addType(data.type)">添加键值</span>
            <span class="operaFont"
                  nz-popconfirm
                  nzOkType="danger"
                  nzTitle="确定删除该字典吗?"
                  (nzOnConfirm)="deleteOne(data.id)"
                  nzPlacement="top"
            >删除</span>
          </td>
        </tr>
        </tbody>
      </nz-table>
    </div>
  </div>
</div>

<!--新增弹框-->
<nz-modal
  class="modalStyle"
  [(nzVisible)]="showAddModal"
  [nzTitle]="modalTitle2"
  [nzContent]="modalContent2"
  [nzFooter]="modalFooter2"
  (nzOnCancel)="showAddModal = false"
  nzWidth="500px"
  [nzStyle]="{top:'15%'}"
  nzMaskClosable="false"
>
  <ng-template #modalTitle2>
    新增字典
  </ng-template>

  <ng-template #modalContent2>
    <form nz-form [formGroup]="validateForm">
      <nz-form-item>
        <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="keyCode">键码</nz-form-label>
        <nz-form-control [nzSm]="14" [nzXs]="24">
          <input nz-input formControlName="keyCode" [(ngModel)]="oneObj.keyCode" id="keyCode" placeholder="请输入键码"/>
          <nz-form-explain *ngIf="validateForm.get('keyCode')?.dirty && validateForm.get('keyCode')?.errors">
            键码不能为空！
          </nz-form-explain>
        </nz-form-control>
      </nz-form-item>
      <nz-form-item>
        <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="keyValue">键值</nz-form-label>
        <nz-form-control [nzSm]="14" [nzXs]="24">
          <nz-input-number formControlName="keyValue" id="keyValue" [(ngModel)]="oneObj.keyValue" [nzMin]="0"
                           [nzMax]="99" [nzStep]="1"></nz-input-number>
          <nz-form-explain *ngIf="validateForm.get('keyValue')?.dirty && validateForm.get('keyValue')?.errors">
            键值不能为空！
          </nz-form-explain>
        </nz-form-control>
      </nz-form-item>
      <nz-form-item>
        <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="type">标签</nz-form-label>
        <nz-form-control [nzSm]="14" [nzXs]="24">
          <input nz-input formControlName="type" [(ngModel)]="oneObj.type" id="type" placeholder="请输入标签"/>
          <nz-form-explain *ngIf="validateForm.get('type')?.dirty && validateForm.get('type')?.errors">
            标签不能为空！
          </nz-form-explain>
        </nz-form-control>
      </nz-form-item>
      <nz-form-item>
        <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="description">描述</nz-form-label>
        <nz-form-control [nzSm]="14" [nzXs]="24">
          <input nz-input formControlName="description" [(ngModel)]="oneObj.description" id="description"
                 placeholder="请输入描述"/>
        </nz-form-control>
      </nz-form-item>
      <nz-form-item>
        <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired nzFor="orderLevel">排序</nz-form-label>
        <nz-form-control [nzSm]="14" [nzXs]="24">
          <nz-input-number nz-input formControlName="orderLevel" [(ngModel)]="oneObj.orderLevel" id="orderLevel"
                           [nzMin]="0" [nzMax]="999" [nzStep]="1"></nz-input-number>
          <nz-form-explain *ngIf="validateForm.get('orderLevel')?.dirty && validateForm.get('orderLevel')?.errors">
            排序不能为空！
          </nz-form-explain>
        </nz-form-control>
      </nz-form-item>
    </form>
  </ng-template>

  <ng-template #modalFooter2>
    <button nz-button nzType="default" (click)="showAddModal = false">取消</button>
    <button nz-button nzType="primary" [disabled]="validateForm.invalid" (click)="handleOk()">保存</button>
  </ng-template>
</nz-modal>

